<template>
  <div class="page-container">
    <div class="common-content-wrap">
      <TrTable
        ref="trTable"
        isNeedSelection
        isNeedIndex
        :btnList="btnList"
        :total="totalNum"
        v-model="searchParams"
        :searchShowList="searchShowList"
        :tableColumn="tableColumn"
        requestName="searchHandle"
        :tableData="assTableData"
        @add="operateHandle($event, 'add')"
        @enable="operateHandle($event, 'enable')"
        @unEnable="operateHandle($event, 'unEnable')"
        @export="operateHandle($event, 'export')"
      />
      <TrEditPopup
        v-model="isShowEdit"
        :width="480"
        :title="checkTitle"
        :valueObj.sync="formObj"
        :formData="formData"
        :list="popupList"
        @close="isShowEdit = false"
        @confrim="confrimHandle"
      />
    </div>
  </div>
</template>

<script>
import {
  getList,
  add,
  enable,
  unEnable,
  exportTableData,
} from "@/api/baseCode/unitOfMeasurement";
import { findByProperty } from "@/utils/util";
import { comExport } from "@/utils/util.js";
import { getColor } from "@/utils/billColor";
import moment from "moment";
import enumData from "@/utils/enumCode.js";
import TrTable from "@/components/Tr-table/Tr-table.vue";
import TrEditPopup from "@/components/Tr-edit/Tr-edit-popup.vue";

export default {
  components: {
    TrTable,
    TrEditPopup,
  },
  name: "unitOfMeasurementBox",
  data: () => ({
    tableColumn: [
      {
        type: "text",
        label: "ERP编码",
        value: "u9Code",
      },
      {
        type: "text",
        label: "单位编码",
        value: "unitCode",
      },
      {
        type: "text",
        label: "单位名称",
        value: "unitName",
      },
      {
        type: "text",
        label: "状态",
        value: "isEnabledLabel",
      },
    ],
    searchShowList: [
      {
        id: "unitCode",
        type: "input",
        width: 33.33,
        label: "单位编码",
        value: "",
      },
      {
        id: "unitName",
        type: "input",
        width: 33.33,
        label: "单位名称",
        value: "",
      },
      {
        id: "isEnabledList",
        type: "multiSelect",
        list: [],
        width: 33.33,
        label: "状态",
        value: [],
      },
    ],
    btnList: [
      {
        label: "新增",
        option: "add",
        color: "blue",
      },
      {
        label: "启用",
        option: "enable",
        color: "white",
        isRelaTable: true,
      },
      {
        label: "停用",
        option: "unEnable",
        color: "white",
        isRelaTable: true,
      },
      // {
      //   label: "导出",
      //   option: "export",
      //   color: "white",
      // },
    ],
    popupList: [
      {
        label: "单位编码",
        type: "input",
        width: 100,
        value: "",
        id: "unitCode",
      },
      {
        label: "单位名称",
        type: "input",
        width: 100,
        value: "",
        id: "unitName",
      },
      {
        label: "是否启用",
        type: "radio",
        width: 100,
        value: 1,
        id: "isEnabled",
        list: [],
      },
    ],
    assTableData: [],
    formObj: {},
    formData: {},
    searchParams: {
      current: 1,
      size: 10,
    },
    totalNum: 0,
    isShowEdit: false,
    currentHandle: "add",
  }),
  computed: {
    checkTitle() {
      const titles = {
        add: "新增",
        default: "编辑",
      };
      return titles[this.currentHandle] || titles.default;
    },
    ids() {
      let ids = [];
      this.$refs.trTable.selectionList.forEach((ele) => {
        ids.push(ele.id);
      });
      return ids.join(",");
    },
  },
  methods: {
    operateHandle(val, type) {
      switch (type) {
        case "add":
          this.isShowEdit = true;
          break;
        case "enable":
          this.enable();
          break;
        case "unEnable":
          this.unEnable();
          break;
        case "export":
          this.$exportHandle({ vm: this, params: this.searchParams });
          break;
        default:
          console.log("11");
          break;
      }
    },
    confrimHandle() {
      console.log("新增确认", this.formObj);
      this.add();
    },
    exportHandle() {
      this.$textShow({
        title: "导出",
        content: [this.$t("tip.export")],
      })
        .then(() => {
          this.$load.show();
          this.searchParams.size = 1000;
          exportTableData(this.searchParams)
            .then((res) => {
              if (res.status != 200)
                return this.$message.error(this.$t("msg.exportFailed"));
              let timeStr = moment().format("YYYYMMDD-HHmmss");
              const fileName = `计量单位-${timeStr}` + ".xlsx";
              comExport(res.data, fileName);
              this.$message.success(this.$t("msg.exportSuccess"));
            })
            .finally(() => {
              this.$load.close();
              this.searchParams.size = 10;
            });
        })
        .catch(() => {});
    },
    async add() {
      const { data } = await await add(this.formObj);
      if (data.code !== 200) return;
      this.isShowEdit = false;
      this.$message.success(this.$t("msg.success"));
      this.searchParams.current = 1;
      this.getListHandle();
    },
    async enable() {
      await this.$textShow({
        title: "启用",
        content: [this.$t("tip.enableTip")],
      });
      const { data } = await enable({ ids: this.ids });
      if (data.code !== 200) return;
      this.$refs.trTable.clearSelect();
      this.$message.success(this.$t("msg.success"));
      this.searchParams.current = 1;
      this.getListHandle();
    },
    async unEnable() {
      await this.$textShow({
        title: "停用",
        content: [this.$t("tip.unenableTip")],
      });
      const { data } = await unEnable({ ids: this.ids });
      if (data.code !== 200) return;
      this.$refs.trTable.clearSelect();
      this.$message.success(this.$t("msg.success"));
      this.searchParams.current = 1;
      this.getListHandle();
    },
    searchHandle() {
      console.log("查询", this.searchParams);
      this.getListHandle();
    },
    async getEnmuData() {
      const { ["PC-ENABLED-LIST"]: enable } = await this.$fetchEnumData([
        enumData.isEnabledList,
      ]);
      let enableItem = findByProperty(
        this.searchShowList,
        "id",
        "isEnabledList"
      );
      let addItem = findByProperty(this.popupList, "id", "isEnabled");
      let enmudata = enable.map((item) => {
        return {
          ...item,
          checked: false,
        };
      });
      enableItem.list = enmudata;
      addItem.list = enmudata;
    },
    getListHandle() {
      getList(this.searchParams).then((res) => {
        if (res.data.code != 200) return;
        this.$validateData(res.data.data);
        this.assTableData = res.data.data.records;
        this.assTableData.forEach((item) => {
          item["isEnabledLabelColor"] = getColor("QT", item.isEnabled);
        });
        this.totalNum = res.data.data.total;
      });
    },
  },
  mounted() {
    this.getEnmuData();
    // this.getListHandle();
  },
};
</script>

<style></style>
